<template>
  <div>
      <div>
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
          <van-swipe-item><img src="../image/36.jpg" style="width: 100%"/></van-swipe-item>
          <van-swipe-item><img src="../image/123.jpg" style="width: 100%; height: 246px"/></van-swipe-item>
          <van-swipe-item><img src="../image/jis4.jpg" style="width: 100%; height: 246px"/></van-swipe-item>
          <van-swipe-item><img src="../image/222.jpg" style="width: 100%; height: 246px" /></van-swipe-item>
          <van-swipe-item><img src="../image/rua.jpg" style="width: 100%; height: 246px "/></van-swipe-item>
        </van-swipe>
        </div>
    <div>
        <van-grid>
          <van-grid-item icon="photo-o" text="文字" />
          <van-grid-item icon="photo-o" text="文字" />
          <van-grid-item icon="photo-o" text="文字" />
          <van-grid-item icon="photo-o" text="文字" />
        </van-grid>
    </div>
   
   <div>
       <van-tabbar v-model="active" @change="onChange">
        <van-tabbar-item icon="home-o">标签1</van-tabbar-item>
        <van-tabbar-item icon="search">标签2</van-tabbar-item>
        <van-tabbar-item icon="friends-o">标签3</van-tabbar-item>
        <van-tabbar-item icon="setting-o">标签4</van-tabbar-item>
      </van-tabbar>
   </div>

  </div>
</template>

<script>
export default {
  data() {
    return {

    };
  },
  props: {},

  components: {},

  created() {},

  mounted() {
      
  },

  methods: {
    onChange(index) {
      Notify({ type: 'primary', message: index });
    },
  },
};
</script>

<style scoped >
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 200px;
  text-align: center;
}
</style>
